<template>
    <div class="frame-body" :class="{'frame-body-col-1':navbarCollapsed==false}">
        <div class="container">
            <div class="left-menu">
                <sideBar :titleText="titleText" :categories="categories" />
            </div>
            <div class="product-navbar-collapse-wrapper" @click="collapseProductNavbar()">
                <div class="product-navbar-collapse-inner">
                    <div class="product-navbar-collapse-bg"></div>
                    <div class="product-navbar-collapse">
                        <a-icon type="left"></a-icon>
                        <a-icon type="right"></a-icon>
                    </div>
                </div>
            </div>
            <router-view @sideBarChange="sidebarChange" />
        </div>
    </div>
</template>

<script>
    import sideBar from "../../../components/sideBar";
    export default {
        data(){
            return {
                navbarCollapsed:false,
                titleText:'项目管理',
                categories:[
                    {title:'概览',route:{name:'project_list',params:{}}},
                    {title:'回收站',route:{name:'project_list',params:{},query:{mode:'trash'}}},
                    {title:'待处理事件',route:{name:'project_event',params:{},query:{mode:'examine'}}},
                    {title:'操作记录',route:{name:'project_event',params:{},query:{mode:'history'}}},
                    {title:'项目数据汇总',route:{name:'project_analysis',params:{}}}
                ]
            }
        },
        components:{
            sideBar
        },
        methods:{
            collapseProductNavbar(){
                this.navbarCollapsed = !this.navbarCollapsed;
            },
            sidebarChange(val){
                if(val.titleText)
                    this.titleText = val.titleText;
                if(val.categories)
                    this.categories = val.categories;
            }
        }
    }
</script>

<style scoped>

</style>